<template>
  <div>
    <div>
      <card
        v-if="$store.state.superAdmin == 'true'"
        style="margin-bottom: 10px"
      >
        <el-select
          style="width: 100%"
          v-model="museumId"
          @change="getReservationMuseumRule"
          filterable
          placeholder="请选择博物馆"
        >
          <el-option
            v-for="item in museumList"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          >
          </el-option>
        </el-select>
      </card>
      <div class="select">
        <div :class="select == 1 ? 'btn1' : 'btn2'" @click="yuyue()">
          个人星期规则
        </div>
        &nbsp;
        <!-- <div :class="select == 4 ? 'btn1' : 'btn2'" @click="tuanyuyue()">
          团队星期规则
        </div>
        &nbsp; -->
        <div :class="select == 2 ? 'btn1' : 'btn2'" @click="xiaochengxu()">
          小程序管理员列表
        </div>
        &nbsp;
        <div :class="select == 3 ? 'btn1' : 'btn2'" @click="riqi()">
          日期规则
        </div>
      </div>
      <div v-if="select == 1">
        <card>
          <div class="flexCSB">
            <div style="display: flex; align-items: center">
              <Button type="primary" @click="create">一键设置规则</Button>
              <Button
                type="warning"
                :loading="loading4"
                style="margin: 0 10px"
                @click="getPassword"
                >立即成为核销管理员</Button
              >
              <Button
                type="warning"
                :loading="loading23"
                style="margin-right: 10px"
                @click="exportBindAdminQRCode"
                >立即成为后台管理员</Button
              >
              <Button style="margin-right: 10px" type="info" @click="setUpWifi"
                >核销扫码器规则设置</Button
              >
              <Button type="primary" @click="getMpMenuConfig"
                >获取微信公众号菜单配置所需信息</Button
              >
            </div>
          </div>

          <div style="margin-top: 10px; display: flex">
            <Select
              style="width: 200px; margin-right: 10px"
              placeholder="请选择导出码的颜色"
              v-model="color"
            >
              <Option value="1">绿色码</Option>
              <Option value="0">黑色码</Option>
            </Select>
            <Button type="error" @click="twoTOne" :loading="loading12"
              >导出二维码物料</Button
            >
            <Button
              type="info"
              style="margin: 0 10px"
              @click="twoTOneModule"
              :loading="loading13"
              >读者海报</Button
            >
            <Button
              type="info"
              style="margin-right: 10px"
              @click="twoTOneModule3"
              :loading="loading19"
              >观众海报</Button
            >
            <Button
              type="info"
              style="margin-right: 10px"
              @click="twoTOneModule4"
              :loading="loading21"
              >20秒入园海报</Button
            >
            <Button
              type="info"
              style="margin-right: 10px"
              @click="twoTOneModule2"
              :loading="loading15"
              >导出推文配图</Button
            >
            <Button type="info" @click="downloadOldCode" :loading="loading24"
              >导出原生二维码</Button
            >
          </div>
        </card>

        <!-- 	<card style="margin:10px 0">
    	<div>
        	<template v-for="(item,key) in arrivalPavilions">
        		<div style="display: flex;align-items: center;">
        			<TimePicker
        			transfer format="HH:mm"
        			type="timerange"
        			:clearable="clearable"
        			placement="bottom-start"
        			placeholder="请选择时间"
        			style="width:500px;margin:5px 0"
        			v-model="item.time"></TimePicker>
        			<Icon type="ios-close-circle-outline" size="24" @click="del(key)" style="margin-left:10px;cursor: pointer;" />
        		</div>
        	</template>
        	<Button type="warning" style="width:100px;margin-top:5px;" @click="add">添加一组</Button>
        </div>
    </card> -->

        <card style="margin-top: 10px">
          <!-- <Tag color="red" style="margin: 10px 0; display: block">
            一周的每一天，预约规则都需设置，按照每周轮循。新建完一项后，可点击
            <span style="color: #57c5f7">复制</span>
            按钮，选择未设置的周，进行快速新建。
          </Tag> -->
          <Tag color="red" style="margin: 10px 0; display: block">
            如果您要设置周几闭馆，只需要到预约配置中的闭馆设置下拉框中选择即可，对应周的预约规则无需删除。
          </Tag>
          <Table
            class="table"
            :loading="loading1"
            highlight-row
            :columns="columns"
            :data="data"
          ></Table>

          <!-- <Modal :mask-closable="false" title="操作" v-model="modal" width="50">
            <Form ref="form" :model="newData" :label-width="160" width="50">
              <FormItem label="*星期：">
                <Select placeholder="请选择星期" v-model="newData.dayOfWeek">
                  <template v-for="item in weekList">
                    <Option :value="item.id">{{ item.name }}</Option>
                  </template>
                </Select>
              </FormItem>
              <FormItem label="*网上预约服务时间 :">
                <div class="flexCenter">
                  <TimePicker
                    type="timerange"
                    placement="bottom-start"
                    placeholder="请选择开始和结束时间"
                    style="width: 100%"
                    v-model="newData.time"
                  ></TimePicker>
                  <Tooltip
                    max-width="900"
                    min-width="500"
                    content="该时间是控制线上预约窗口的服务时间，并不是预约选择的到馆时间"
                    placement="left"
                  >
                    <Icon
                      style="margin-left: 10px; margin-top: 7px"
                      size="20"
                      type="ios-help-circle-outline"
                    />
                  </Tooltip>
                  <p @click="setAllday">设置为全天</p>
                </div>
              </FormItem>
              <FormItem label="最多预约几天内：">
                <InputNumber
                  style="width: 100%"
                  placeholder="请输入最多预约天数"
                  :min="0"
                  v-model="newData.mostDays"
                ></InputNumber>
              </FormItem>
              <FormItem label="*总预约名额：">
                <InputNumber
                  style="width: 100%"
                  placeholder="请输入总预约名额"
                  :min="0"
                  v-model="newData.quota"
                ></InputNumber>
              </FormItem>
              <FormItem label="详细设置：">
                <Button
                  type="primary"
                  :loading="loading17"
                  @click="setup"
                  style="width: 100px"
                  >前往设置</Button
                >
              </FormItem>
              <Table
                class="table"
                highlight-row
                :columns="columns2"
                :data="newData.detailedSettings"
              ></Table>
            </Form>
            <div slot="footer">
              <Button type="warning" class="Button" @click="modal = false"
                >关闭</Button
              >
              <Button
                type="success"
                class="Button"
                :loading="loading2"
                @click="submit"
                >提交</Button
              >
            </div>
          </Modal> -->

          <Modal :mask-closable="false" title="操作" v-model="modal" width="50">
            <Form ref="form" :model="newData" :label-width="160" width="50">
              <FormItem label="*星期：">
                <Select v-if='!bol' placeholder="请选择星期" v-model="newData.dayOfWeek">
                    <Option v-for="item in weekList" :value="item.id" :key="item.id">{{ item.name }}</Option>
                </Select>
                <Select v-if="bol" multiple placeholder="请选择星期" v-model="newData.dayOfWeek1">
                    <Option v-for="item in weekList" :value="item.id" :key="item.id">{{ item.name }}</Option>
                </Select>
              </FormItem>
              <FormItem label="*网上预约服务时间 :">
                <div class="flexCenter">
                  <TimePicker
                    type="timerange"
                    placement="bottom-start"
                    placeholder="请选择开始和结束时间"
                    style="width: 100%"
                    v-model="newData.time"
                  ></TimePicker>
                  <Tooltip
                    max-width="900"
                    min-width="500"
                    content="该时间是控制线上预约窗口的服务时间，并不是预约选择的到馆时间"
                    placement="left"
                  >
                    <Icon
                      style="margin-left: 10px; margin-top: 7px"
                      size="20"
                      type="ios-help-circle-outline"
                    />
                  </Tooltip>
                  <p @click="setAllday">设置为全天</p>
                </div>
              </FormItem>
              <FormItem label="最多预约几天内：">
                <InputNumber
                  style="width: 100%"
                  placeholder="请输入最多预约天数"
                  :min="0"
                  v-model="newData.mostDays"
                ></InputNumber>
              </FormItem>
              <!-- <FormItem label="*总预约名额：">
                <InputNumber
                  style="width: 100%"
                  placeholder="请输入总预约名额"
                  :min="0"
                  v-model="newData.quota"
                ></InputNumber>
              </FormItem> -->
              <!-- 				<FormItem label="上午预约名额：">
					<InputNumber style="width:100%" placeholder="请输入上午预约名额，如果不设置上午接待人数，可以不输入" :min="0" v-model="newData.amQuota"></InputNumber>
				</FormItem>
				<FormItem label="下午预约名额：">
					<InputNumber style="width:100%" placeholder="请输入下午预约名额，如果不设置下午接待人数，可以不输入" :min="0" v-model="newData.pmQuota"></InputNumber>
				</FormItem> -->
              <FormItem label="详细设置：">
                <!-- <Button
                  type="primary"
                  :loading="loading17"
                  @click="setup"
                  style="width: 100px"
                  >前往设置</Button
                > -->
                <template v-for="(item, key) in detailedSettings">
              <div style="display: flex; align-items: center" :key="key">
                <TimePicker
                disabled
                  transfer
                  format="HH:mm"
                  type="timerange"
                  :clearable="clearable"
                  placement="bottom-start"
                  placeholder="请选择时间"
                  style="width: 400px; margin: 5px 0"
                  v-model="item.sessionTime"
                ></TimePicker>
                <Input-number placeholder="请输入名额" style="width: 100px; margin: 10px 10px" :clearable="clearable" :min="0" v-model="item.num"></Input-number>
                <Icon
                  type="ios-close-circle-outline"
                  size="24"
                  @click="del(key)"
                  style="margin-left: 10px; cursor: pointer"
                />
              </div>
            </template>
              </FormItem>
              <!-- <Table
                class="table"
                highlight-row
                :columns="columns2"
                :data="newData.detailedSettings"
              ></Table> -->

            </Form>
            <div slot="footer">
              <Button type="warning" class="Button" @click="modal = false"
                >关闭</Button
              >
              <Button
                type="success"
                class="Button"
                :loading="loading2"
                @click="submit"
                >提交</Button
              >
            </div>
          </Modal>
          <Modal :mask-closable="false" title="详情" v-model="modal3" width="50">
            <Form ref="form" :model="newData" :label-width="160" width="50">
              <FormItem label="*星期：">
                <Select disabled placeholder="请选择星期" v-model="newData.dayOfWeek">
                  <template v-for="item in weekList">
                    <Option :value="item.id">{{ item.name }}</Option>
                  </template>
                </Select>
              </FormItem>
              <FormItem label="*网上预约服务时间 :">
                <div class="flexCenter">
                  <TimePicker
                  disabled
                    type="timerange"
                    placement="bottom-start"
                    placeholder="请选择开始和结束时间"
                    style="width: 100%"
                    v-model="newData.time"
                  ></TimePicker>
                  <!-- <Tooltip
                    max-width="900"
                    min-width="500"
                    content="该时间是控制线上预约窗口的服务时间，并不是预约选择的到馆时间"
                    placement="left"
                  >
                    <Icon
                      style="margin-left: 10px; margin-top: 7px"
                      size="20"
                      type="ios-help-circle-outline"
                    />
                  </Tooltip>
                  <p @click="setAllday">设置为全天</p> -->
                </div>
              </FormItem>
              <FormItem label="最多预约几天内：">
                <InputNumber
                disabled
                  style="width: 100%"
                  placeholder="请输入最多预约天数"
                  :min="0"
                  v-model="newData.mostDays"
                ></InputNumber>
              </FormItem>
              <!-- <FormItem label="*总预约名额：">
                <InputNumber
                  style="width: 100%"
                  placeholder="请输入总预约名额"
                  :min="0"
                  v-model="newData.quota"
                ></InputNumber>
              </FormItem> -->
              <!-- 				<FormItem label="上午预约名额：">
					<InputNumber style="width:100%" placeholder="请输入上午预约名额，如果不设置上午接待人数，可以不输入" :min="0" v-model="newData.amQuota"></InputNumber>
				</FormItem>
				<FormItem label="下午预约名额：">
					<InputNumber style="width:100%" placeholder="请输入下午预约名额，如果不设置下午接待人数，可以不输入" :min="0" v-model="newData.pmQuota"></InputNumber>
				</FormItem> -->
              <FormItem label="详细设置：">
                <!-- <Button
                  type="primary"
                  :loading="loading17"
                  @click="setup"
                  style="width: 100px"
                  >前往设置</Button
                > -->
                <template v-for="(item, key) in detailedSettings">
              <div style="display: flex; align-items: center" :key="key">
                <TimePicker
                disabled
                  transfer
                  format="HH:mm"
                  type="timerange"
                  :clearable="clearable"
                  placement="bottom-start"
                  placeholder="请选择时间"
                  style="width: 400px; margin: 5px 0"
                  v-model="item.sessionTime"
                ></TimePicker>
                <Input-number disabled placeholder="请输入名额" style="width: 100px; margin: 10px 10px" :clearable="clearable" :min="0" v-model="item.num"></Input-number>
                <!-- <Icon
                  type="ios-close-circle-outline"
                  size="24"
                  @click="del(key)"
                  style="margin-left: 10px; cursor: pointer"
                /> -->
              </div>
            </template>
              </FormItem>
              <!-- <Table
                class="table"
                highlight-row
                :columns="columns2"
                :data="newData.detailedSettings"
              ></Table> -->

            </Form>
            <div slot="footer">
              <!-- <Button type="warning" class="Button" @click="modal = false"
                >关闭</Button
              >
              <Button
                type="success"
                class="Button"
                :loading="loading2"
                @click="submit"
                >提交</Button
              > -->
            </div>
          </Modal>
          <Modal
            :mask-closable="false"
            title="详细设置（不同时间段的限制预约名额）"
            v-model="modal2"
          >
            <Tag color="red" style="margin-bottom: 10px; display: block">
              此处的时间下拉列表是与预约配置中的到馆时间列表一致的。
            </Tag>
            <div
              style="margin-bottom: 20px"
              v-for="(item, key) in detailedSettings"
            >
              <div class="flexCSB">
                <p style="font-weight: bold">第 {{ key + 1 }} 组</p>
                <p v-if="id != ''" class="del" @click="del(key)">删除</p>
              </div>
              <div class="flexCSB" style="margin: 5px 0">
                <p style="width: 50px">人数：</p>
                <InputNumber
                  style="width: 100%"
                  placeholder="请输入人数"
                  :min="0"
                  v-model="item.num"
                ></InputNumber>
              </div>
              <div class="flexCSB">
                <p style="width: 50px">时间：</p>
                <!-- <TimePicker type="timerange" placement="bottom-start" v-model="item.timeArea" placeholder="选择时间" style="width: 100%"></TimePicker> -->
                <Select
                  placeholder="选择时间"
                  v-model="item.timeArea"
                  style="width: 100%"
                >
                  <template v-for="item in arrivalPavilions">
                    <Option :value="item">{{ item }}</Option>
                  </template>
                </Select>
              </div>
            </div>
            <div slot="footer">
              <Button v-if="id != ''" type="warning" class="Button" @click="add"
                ><Icon
                  type="ios-add-circle-outline"
                  style="margin-right: 10px"
                />新增一组</Button
              >
              <Button type="success" class="Button" @click="submit2"
                >确认</Button
              >
            </div>
          </Modal>

          <Modal
            :mask-closable="false"
            v-model="codeModal"
            fullscreen
            width="1000"
            title="导出读者海报"
          >
            <div ref="codePage" class="codeModalClass1">
              <img
                style="width: 100%; height: 3150px"
                src="https://museum-voice.bowu66.com/image/wenlvhoutai/haibao2.jpg"
              />
              <!-- <img style="width:100%;height:3150px" src="http://static.bowu66.com/wenlv/houtai/haibao2.jpg"> -->
              <p class="museum_title">{{ museumName }}</p>
              <img :src="'data:image/png;base64,' + CODE" class="codeImg" />
            </div>
            <div slot="footer">
              <Button
                type="success"
                class="Button"
                @click="code_download"
                :loading="loading14"
                >导出海报</Button
              >
            </div>
          </Modal>

          <Modal
            :mask-closable="false"
            v-model="codeModal3"
            fullscreen
            width="1000"
            title="导出观众海报"
          >
            <div ref="codePage3" class="codeModalClass3">
              <img
                style="width: 100%; height: 2717px"
                src="https://museum-voice.bowu66.com/image/wenlvhoutai/haibao.jpg"
              />
              <p class="museum_title3">{{ museumName }}</p>
              <img :src="'data:image/png;base64,' + CODE3" class="codeImg3" />
            </div>
            <div slot="footer">
              <Button
                type="success"
                class="Button"
                @click="code_download3"
                :loading="loading20"
                >导出海报</Button
              >
            </div>
          </Modal>

          <Modal
            :mask-closable="false"
            v-model="codeModal4"
            fullscreen
            width="1000"
            title="导出20秒入园海报"
          >
            <div ref="codePage4" class="codeModalClass4">
              <img
                style="width: 100%; height: 5102px"
                src="https://museum-voice.bowu66.com/image/wenlvhoutai/haibao3.png"
              />
              <p class="museum_title4">{{ museumName }}</p>
              <img :src="'data:image/png;base64,' + CODE4" class="codeImg4" />
            </div>
            <div slot="footer">
              <Button
                type="success"
                class="Button"
                @click="code_download4"
                :loading="loading20"
                >导出海报</Button
              >
            </div>
          </Modal>

          <Modal
            :mask-closable="false"
            v-model="codeModal2"
            width="500"
            title="导出 预约+核销 推文配图"
          >
            <div ref="codePage2" class="codeModalClass">
              <img
                style="width: 100%; height: 693px"
                src="https://museum-voice.bowu66.com/image/wenlvhoutai/lvma.jpg"
              />
              <img :src="'data:image/png;base64,' + CODE2" class="codeImg2" />
            </div>
            <div slot="footer">
              <Button
                type="success"
                class="Button"
                @click="code_download2"
                :loading="loading16"
                >导出海报</Button
              >
            </div>
          </Modal>

          <Modal
            :mask-closable="false"
            v-model="has"
            width="500"
            title="温馨提示"
          >
            <p style="font-weight: bold; font-size: 20px">
              系统校测到您预约规则还未设置，是否初始化？
            </p>
            <div slot="footer">
              <Button
                type="success"
                class="Button"
                @click="chushihua"
                :loading="loading18"
                >立即初始化</Button
              >
            </div>
          </Modal>

          <Modal
            v-model="qrcodeModal"
            title="成为小程序端管理员身份"
            width="400"
          >
            <div id="qrcode" ref="qrcode"></div>
            <p :style="{marginTop:'20px',fontSize:'12px',color:'red',textAlign:'center'}">请使用"文旅绿码"小程序中"我的"页面中"申请管理权限"按钮扫码</p>
            <div slot="footer"></div>
          </Modal>

          <Modal
            title="微信公众号菜单小程序页面路径"
            v-model="router"
            :styles="{ top: '20px' }"
          >
            <p>
              小程序appId: {{ appid }}
              <span
                v-clipboard:copy="appid"
                v-clipboard:success="onCopyappId"
                v-clipboard:error="onError"
                style="color: #57c5f7; margin-left: 20px; cursor: pointer"
                >复制</span
              >
            </p>
            <p>
              小程序预约页面路径: {{ pagePath }}
              <span
                v-clipboard:copy="pagePath"
                v-clipboard:success="onCopy"
                v-clipboard:error="onError"
                style="color: #57c5f7; margin-left: 20px; cursor: pointer"
                >复制</span
              >
            </p>
              <p>
              备用网页: {{ alternatePage }}
              <span
                v-clipboard:copy="alternatePage"
                v-clipboard:success="onCopy"
                v-clipboard:error="onError"
                style="color: #57c5f7; margin-left: 20px; cursor: pointer"
                >复制</span
              >
            </p>
             
          </Modal>

          <Modal v-model="adminModal" title="获取扫码登录后台权限" width="400">
            <img :src="adminImg" style="width: 100%" />
            <div slot="footer"></div>
          </Modal>

          <Modal v-model="weiguangModal" title="微光扫码器规则设置" width="400">
            <h3 style="text-align: center; color: red; margin-bottom: 20px">
              扫码设备仅支持连接 2.4GHz频段的WIFI
            </h3>
            <Form
              ref="form"
              :model="weiguangData"
              :label-width="100"
              width="50"
            >
              <FormItem label="连入wifi名：">
                <Input
                  style="width: 100%"
                  v-model="weiguangData.wifiName"
                ></Input>
              </FormItem>
              <FormItem label="wifi密码：">
                <Input
                  style="width: 100%"
                  v-model="weiguangData.wifiPassword"
                ></Input>
              </FormItem>
            </Form>
            <Button
              type="success"
              :loading="loading22"
              style="width: 100%"
              @click="weiguangSubmit"
              >立即生成</Button
            >
            <img :src="weiguangUrl" style="width: 100%" />
            <Button
              v-show="weiguangUrl"
              type="info"
              style="width: 100%"
              @click="weiguangDownload"
              >点击下载</Button
            >
            <div slot="footer"></div>
          </Modal>
        </card>
      </div>
      <div v-if="select == 2">
        <Table
          class="table"
          :loading="loading1"
          highlight-row
          :columns="columns3"
          :data="managerdata"
        ></Table>
        <Modal
          v-model="modaldata"
          title="提示:"
          @on-ok="erdata"
          @on-cancel="cancel"
        >
          <p style="text-align: center">确认解绑该用户?</p>
        </Modal>
      </div>
      <div v-if="select == 3">
        <div class="select3">
          <Button type="success" class="newWarehouse" @click="modelshows"
            >新增门票</Button
          >
          <Modal
            v-model="modelshow"
            title="设置票仓"
            @on-ok="ok"
            @on-cancel="cancels"
          >
            <Form>
              <div style="display: flex; flex-wrap: wrap">
                <div
                  v-for="(item, index) in range"
                  :key="index"
                  style="width: 49%"
                >
                  <FormItem :label="item.timeRange">
                    <Input
                      placeholder="请输入人数"
                      v-model="ticketNum[index]"
                      clearable
                      style="width: 100px"
                    ></Input
                    >人
                  </FormItem>
                </div>
              </div>
              <div class="findtime">
                <FormItem label="起止日期">
                  <DatePicker
                    :clearable="clearable"
                    format="yyyy-MM-dd"
                    type="daterange"
                    placeholder="请选择起止时间"
                    style="width: 200px"
                    :value="time2"
                    @on-change="onChange"
                  ></DatePicker
                ></FormItem>
                <FormItem label="设置星期">
                  <div>
                    <el-checkbox-group v-model="checkboxGroup4" size="mini">
                      <el-checkbox-button
                        v-for="week in weeks"
                        :label="week"
                        :key="week"
                        >{{ week }}</el-checkbox-button
                      >
                    </el-checkbox-group>
                  </div>
                </FormItem>
              </div>
            </Form>
          </Modal>

          <Button type="warning" class="newWarehouse" @click="modelshows2"
            >修改门票</Button
          >

          <Modal
            v-model="modelshow2"
            title="修改票仓"
            @on-ok="ok2"
            @on-cancel="cancels"
          >
            <Form>
              <div style="display: flex; flex-wrap: wrap">
                <div
                  v-for="(item, index) in range"
                  :key="index"
                  style="width: 49%"
                >
                  <FormItem :label="item.timeRange">
                    <Input
                      placeholder="请输入人数"
                      v-model="ticketNum[index]"
                      clearable
                      style="width: 100px"
                    ></Input
                    >人
                  </FormItem>
                </div>
              </div>
              <div class="findtime">
                <FormItem label="起止日期">
                  <DatePicker
                    :clearable="clearable"
                    format="yyyy-MM-dd"
                    type="daterange"
                    placeholder="请选择起止时间"
                    style="width: 200px"
                    :value="time2"
                    @on-change="onChange"
                  ></DatePicker
                ></FormItem>
                <FormItem label="设置星期">
                  <div>
                    <el-checkbox-group v-model="checkboxGroup4" size="mini">
                      <el-checkbox-button
                        v-for="week in weeks"
                        :label="week"
                        :key="week"
                        >{{ week }}</el-checkbox-button
                      >
                    </el-checkbox-group>
                  </div>
                </FormItem>
              </div>
            </Form>
          </Modal>
          <Button type="error" class="newWarehouse" @click="modelshows3"
            >删除门票</Button
          >

          <el-dialog
            title="删除门票"
            :visible.sync="modelshow3"
            width="40%"
            :append-to-body="true"
          >
            <Form>
              <FormItem label="删除日期">
                <DatePicker
                  :clearable="clearable"
                  format="yyyy-MM-dd"
                  type="daterange"
                  placeholder="请选择起止时间"
                  style="width: 300px"
                  :value="time2"
                  @on-change="onChangeds"
                ></DatePicker>
              </FormItem>
            </Form>
            <el-dialog
              width="20%"
              title="确认删除?"
              :visible.sync="innerVisible"
              append-to-body
            >
              <div slot="footer" class="dialog-footer">
      <el-button @click="innerVisible = false">取 消</el-button>
      <el-button type="primary" @click="deleteCalendarStockd()">确认</el-button>
    </div>
            </el-dialog>

            <span slot="footer" class="dialog-footer">
              <el-button @click="(modelshow3 = false), cancels()"
                >取 消</el-button
              >
              <el-button type="primary" @click="deleteCalendarStock()"
                >确 定</el-button
              >
            </span>
          </el-dialog>

          <!-- <Modal
            v-model="modelshow3"
            @on-ok="deleteCalendarStock"
            @on-cancel="cancels"
            title="删除门票"
          >
            <Form>
              <FormItem label="删除日期">
                <DatePicker
                  :clearable="clearable"
                  format="yyyy-MM-dd"
                  type="daterange"
                  placeholder="请选择起止时间"
                  style="width: 300px"
                  :value="time2"
                  @on-change="onChangeds"
                ></DatePicker>
              </FormItem>
            </Form>
          </Modal> -->
          <Button type="" class="newWarehouse" @click="changetime(-1)"
            >前七天</Button
          >
          <!-- 选择1 -->
          <DatePicker
            :clearable="clearable"
            format="yyyy-MM-dd"
            type="daterange"
            placeholder="请选择起止时间"
            style="width: 300px"
            :value="time"
            @on-change="onChanged"
          ></DatePicker>
          <Button type="" class="newWarehouse" @click="changetime(1)"
            >后七天</Button
          >
        </div>
        <div class="table1" v-if="ticket_list.length">
          <div class="column" v-for="item in ticket_list">
            <div class="title">
              {{ item.stockDate }}
            </div>
            <div class="content">
              <div class="neirong" v-for="v in item.tickets">
                <div class="time">场次 : {{ v.sessionTime }}</div>
                <div class="num">人数: {{ v.stockNum }}</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import axios from 'axios'
import QRCode from 'qrcodejs2'
import html2canvas from 'html2canvas'
export default {
  data () {
    return {
      result: [],
      weeks: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
      checkboxGroup4: [],
      time: [],
      time2: [],
      modelshow: false,
      modelshow2: false,
      modelshow3: false,
      innerVisible: false,
      ticketNum: [],
      clearable: false,
      range: [],
      modaldata: false,
      select: true,
      qrcodeModal: false,
      pagePath: '',
      alternatePage: '',
      appid:'',
      loading1: false,
      loading2: false,
      loading3: false,
      loading4: false,
      loading5: false,
      loading6: false,
      loading7: false,
      loading8: false,
      loading9: false,
      loading10: false,
      loading11: false,
      loading12: false,
      loading13: false,
      loading14: false,
      loading15: false,
      loading16: false,
      loading17: false,
      loading18: false,
      loading19: false,
      loading20: false,
      loading21: false,
      loading22: false,
      loading23: false,
      loading24: false,
      router: false,
      data: [],
      total: 0,
      columns: [
        { title: '星期', key: 'dayOfWeek2', align: 'center', minWidth: 150 },
        // {title:'上午预约名额',key:'amQuota2',align: 'center',minWidth:150},
        // {title:'下午预约名额',key:'pmQuota2',align: 'center',minWidth:150},
        {
          title: '开放网上预约服务',
          key: 'beginTime',
          align: 'center',
          minWidth: 150
        },
        {
          title: '关闭网上预约服务',
          key: 'endTime',
          align: 'center',
          minWidth: 150
        },
        {
          title: '最多预约几天内',
          key: 'mostDays2',
          align: 'center',
          minWidth: 150
        },
        { title: '总预约名额', key: 'quota2', align: 'center', minWidth: 150 },
        {
          title: '操作',
          align: 'center',
          minWidth: 280,
          render: (h, params) => {
            return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'success'
                  },
                  style: {
                    marginRight: '10px'
                  },
                  on: {
                    click: () => {
                      this.update(params)
                    }
                  }
                },
                '修改'
              ),
              // h(
              //   "Button",
              //   {
              //     props: {
              //       type: "warning",
              //     },
              //     style: {
              //       marginRight: "10px",
              //     },
              //     on: {
              //       click: () => {
              //         this.copy(params);
              //       },
              //     },
              //   },
              //   "复制"
              // ),
              h(
                'Button',
                {
                  props: {
                    type: 'warning'
                  },
                  style: {
                    marginRight: '10px'
                  },
                  on: {
                    click: () => {
                      this.detail(params)
                    }
                  }
                },
                '详情'
              ),
              h(
                'Button',
                {
                  props: {
                    type: 'error'
                  },
                  on: {
                    click: () => {
                      this.delItem(params)
                    }
                  }
                },
                '删除'
              )
            ])
          }
        }
      ],
      columns2: [
        { title: '人数', key: 'num', align: 'center' },
        { title: '开始时间', key: 'timeAreaStart', align: 'center' },
        { title: '结束时间', key: 'timeAreaEnd', align: 'center' }
      ],
      managerdata: [],
      columns3: [
        { title: '微信昵称', key: 'nickName', align: 'center', minWidth: 90 },
        {
          title: '头像',
          key: 'headImgUrl',
          align: 'center',
          maxWidth: 80,
          render: (h, params) => {
            return h('img', {
              style: {
                width: '60px',
                marginTop: '6px',
                'border-radius': '50%'
              },
              attrs: {
                src: params.row.headImgUrl
              }
            })
          }
        },
        { title: '手机号', key: 'phone', align: 'center', minWidth: 100 },
        { title: 'openid', key: 'openid', align: 'center', minWidth: 130 },
        {
          title: '操作',
          align: 'center',
          fixed: 'right',
          minWidth: 150,
          render: (h, params) => {
            return h('div', [
              h(
                'Button',
                {
                  props: {
                    type: 'success'
                  },
                  on: {
                    click: () => {
                      this.showmangerdata(params)
                    }
                  }
                },
                '解绑'
              )
            ])
          }
        }
      ],

      newData: {
        amQuota: '',
        mostDays: '',
        // dayOfWeek: "",
        dayOfWeek: '',
        dayOfWeek1:[],
        detailedSettings: [],
        pmQuota: '',
        quota: '',
        time: ''
      },
      id: '',
      weekList: [
        { id: 1, name: '星期一' },
        { id: 2, name: '星期二' },
        { id: 3, name: '星期三' },
        { id: 4, name: '星期四' },
        { id: 5, name: '星期五' },
        { id: 6, name: '星期六' },
        { id: 7, name: '星期日' }
      ],
      timeList: [
        '07:00-08:00',
        '08:00-09:00',
        '09:00-10:00',
        '10:00-11:00',
        '11:00-12:00',
        '12:00-13:00',
        '13:00-14:00',
        '14:00-15:00',
        '15:00-16:00',
        '16:00-17:00',
        '17:00-18:00'
      ],
      detailedSettings: [],
      modal2: false,
      //
      museumId: '',
      museumList: [],
      // 详细设置
      modal: false,
      modal3: false,
      // 生成海报
      generateModal: false,
      generateModal2: false,
      generateModal3: false,
      //
      code1: '',
      code2: '',
      code3: '',
      code4: '',
      code5: '',
      code6: '',
      code7: '',
      //
      CODE: '',
      CODE2: '',
      CODE3: '',
      CODE4: '',
      //
      codeModal: false,
      codeModal2: false,
      codeModal3: false,
      codeModal4: false,
      //
      arrivalPavilions: [],
      //
      has: false,
      museumName: '',
      color: '1',
      //
      weiguangModal: false,
      weiguangUrl: '',
      weiguangData: {
        wifiName: '',
        wifiPassword: ''
      },
      ticket_list: [],
      adminImg: '',
      adminModal: false,
      date: [],
      bol: true
    }
  },
  created () {
    this.date[0] = this.getTime(new Date())
    this.date[1] = this.getTime(
      new Date(new Date(this.date[0]).getTime() + 86400000 * 6)
    )
    this.time = [...this.date]
    console.log(this.time)

    if (this.$store.state.superAdmin == 'true') {
      this.getAppMuseumDropDown()
    } else {
      this.museumName = this.$store.state.museumName
      if (this.$store.state.museums.length > 1) {
        this.museumId = this.$store.state.museumId
      } else {
        this.museumId = ''
      }
      this.hasReservationRule()
      // this.getAppletsWxManager()
    }
  },
  methods: {
    changetime (data) {
      console.log(data)
      this.date[0] = this.getTime(
        new Date(new Date(this.date[0]).getTime() + data * 86400000 * 6)
      )
      this.date[1] = this.getTime(
        new Date(new Date(this.date[1]).getTime() + data * 86400000 * 6)
      )
      this.time = [...this.date]
      this.getCalendarStocks(this.date)
    },

    // getCalendarStocks() {
    //   this.$http(
    //     "/stage/calendarTicket/getCalendarStocks",
    //     {
    //       museumId: this.museumId,
    //       startDate: this.time[0],
    //       startEnd: this.time[1],
    //     },
    //     "post",
    //     (res) => {
    //       console.log(res);
    //     }
    //   );
    // },
    getCalendarStocks (date) {
      this.$http(
        '/stage/calendarTicket/getCalendarStocks',
        {
          museumId: this.museumId,
          startDate: date[0],
          startEnd: date[1]
        },
        'post',
        (res) => {
          console.log(res)
          this.ticket_list = res.data.data
        }
      )
    },
    deleteCalendarStock () {
      if (this.time2.length == 0) {
        this.$Message.error('请选择日期')
      } else {
        this.innerVisible = true
      }
      //  this.modelshow3 = false
      // this.$http(
      //   "/stage/calendarTicket/deleteCalendarStock",
      //   {
      //     museumId: this.museumId,
      //     stockDateStart: this.time2[0],
      //     stockDateEnd: this.time2[1],
      //   },
      //   "post",
      //   (res) => {
      //     console.log(res);
      //     this.$Message.success("删除成功");
      //     this.getCalendarStocks(this.time);
      //     this.time2 = []
      //   }
      // );
    },
    deleteCalendarStockd () {
      this.$http(
        '/stage/calendarTicket/deleteCalendarStock',
        {
          museumId: this.museumId,
          stockDateStart: this.time2[0],
          stockDateEnd: this.time2[1]
        },
        'post',
        (res) => {
          console.log(res)
          this.modelshow3 = false
          this.innerVisible = false
          if (res.data.data == false) {
            this.$Message.success('删除失败')
          } else {
            this.$Message.success('删除成功')
          }

          this.getCalendarStocks(this.time)
          this.time2 = []
        }
      )
    },
    onChange (data) {
      console.log(data)
      this.time2 = data
    },

    onChanged (data) {
      console.log(data)
      this.time = data
      this.getCalendarStocks(this.time)
    },
    onChangeds (data) {
      console.log(data)
      this.time2 = data
    },
    ok () {
      if (this.time2.length == 0) {
        this.$Message.error('请选择日期')
        return
      }
      console.log('ok')
      console.log(this.checkboxGroup4)
      let timerange = []
      console.log(this.ticketNum)
      console.log(this.ticketNum.length)
      for (var i = 0; i < this.range.length; i++) {
        timerange.push(this.range[i].timeRange)
      }
      let result = timerange.map((sessionTime, i) => ({
        sessionTime,
        stockNum: this.ticketNum[i]
      }))

      this.result = result
      console.log(result)
      for (var j = 0; j < this.result.length; j++) {
        console.log(this.result[j].stockNum)
        if (this.result[j].stockNum == undefined) {
          this.$Message.error('请输入限制人数')
          return
        }
        this.result[j].stockNum = Number(this.result[j].stockNum)
      }
      // if (this.checkboxGroup4.length == 0) {
      //   this.$Message.error("请选择限制星期");
      //   return;
      // }

      console.log(this.museumId)
      console.log(this.time)
      console.log(this.result)
      console.log(this.checkboxGroup4)
      var time = JSON.parse(JSON.stringify(this.time))
      var results = JSON.parse(JSON.stringify(this.result))
      var checkboxGroup4 = JSON.parse(JSON.stringify(this.checkboxGroup4))
      var checkbox = []
      for (let k = 0; k < checkboxGroup4.length; k++) {
        checkbox.push(checkboxGroup4[k].replace('周', ''))
      }
      console.log(checkbox)
      for (let l = 0; l < checkbox.length; l++) {
        if (checkbox[l] == '一') {
          checkbox[l] = 1
        } else if (checkbox[l] == '二') {
          checkbox[l] = 2
        } else if (checkbox[l] == '三') {
          checkbox[l] = 3
        } else if (checkbox[l] == '四') {
          checkbox[l] = 4
        } else if (checkbox[l] == '五') {
          checkbox[l] = 5
        } else if (checkbox[l] == '六') {
          checkbox[l] = 6
        } else if (checkbox[l] == '日') {
          checkbox[l] = 7
        }
      }
      console.log(time, results, checkbox)

      this.$http(
        '/stage/calendarTicket/addCalendarStock',
        {
          museumId: this.museumId,
          stockDateEnd: this.time2[1],
          stockDateStart: this.time2[0],
          tickets: results,
          weeks: checkbox
        },
        'post',
        (res) => {
          this.modelshow = false
          console.log(res)
          console.log(res.data.code)
          if (res.data.code == 200) {
            this.$Message.success('新增成功')
            this.range = res.data.data
            this.getCalendarStocks(this.time)
          } else {
            this.$Message.error(res.data.msg)
          }
          this.checkboxGroup4 = []
          this.ticketNum = []
          this.time2 = []
        }
      )
    },

    ok2 () {
      if (this.time2.length == 0) {
        this.$Message.error('请选择日期')
        return
      }
      console.log('ok')
      console.log(this.checkboxGroup4)
      let timerange = []
      console.log(this.ticketNum)
      console.log(this.ticketNum.length)
      for (var i = 0; i < this.range.length; i++) {
        timerange.push(this.range[i].timeRange)
      }
      let result = timerange.map((sessionTime, i) => ({
        sessionTime,
        stockNum: this.ticketNum[i]
      }))

      this.result = result
      console.log(result)
      for (var j = 0; j < this.result.length; j++) {
        console.log(this.result[j].stockNum)
        if (this.result[j].stockNum == undefined) {
          this.$Message.error('请输入限制人数')
          return
        }
        this.result[j].stockNum = Number(this.result[j].stockNum)
      }
      // if (this.checkboxGroup4.length == 0) {
      //   this.$Message.error("请选择限制星期");
      //   return;
      // }
      console.log(this.museumId)
      console.log(this.time)

      console.log(this.result)
      console.log(this.checkboxGroup4)
      var time = JSON.parse(JSON.stringify(this.time))
      var results = JSON.parse(JSON.stringify(this.result))
      var checkboxGroup4 = JSON.parse(JSON.stringify(this.checkboxGroup4))
      var checkbox = []
      for (let k = 0; k < checkboxGroup4.length; k++) {
        checkbox.push(checkboxGroup4[k].replace('周', ''))
      }
      console.log(checkbox)
      for (let l = 0; l < checkbox.length; l++) {
        if (checkbox[l] == '一') {
          checkbox[l] = 1
        } else if (checkbox[l] == '二') {
          checkbox[l] = 2
        } else if (checkbox[l] == '三') {
          checkbox[l] = 3
        } else if (checkbox[l] == '四') {
          checkbox[l] = 4
        } else if (checkbox[l] == '五') {
          checkbox[l] = 5
        } else if (checkbox[l] == '六') {
          checkbox[l] = 6
        } else if (checkbox[l] == '日') {
          checkbox[l] = 7
        }
      }
      console.log(time, results, checkbox)

      this.$http(
        '/stage/calendarTicket/updateCalendarStock',
        {
          museumId: this.museumId,
          stockDateEnd: this.time2[1],
          stockDateStart: this.time2[0],
          tickets: results,
          weeks: checkbox
        },
        'post',
        (res) => {
          this.modelshow = false
          console.log(res)
          if (res.data.code == 200) {
            this.range = res.data.data
            this.getCalendarStocks(this.time)
            this.$Message.success('修改成功')
          } else {
            this.$Message.error(res.data.msg)
          }

          this.checkboxGroup4 = []
          this.ticketNum = []
          this.time2 = []
        }
      )
    },

    modelshows () {
      this.modelshow = true
      this.$http(
        '/stage/calendarTicket/getReservationMuseumArrivalRange',
        {
          museumId: this.museumId
        },
        'get',
        (res) => {
          console.log(res)
          this.range = res.data.data
        }
      )
    },
    modelshows2 () {
      this.modelshow2 = true
      this.$http(
        '/stage/calendarTicket/getReservationMuseumArrivalRange',
        {
          museumId: this.museumId
        },
        'get',
        (res) => {
          console.log(res)
          this.range = res.data.data
        }
      )
    },
    modelshows3 () {
      this.modelshow3 = true
    },
    showmangerdata (params) {
      console.log(params.row.id)
      this.managerdatas = params.row
      this.modaldata = true
    },
    getAppletsWxManager () {
      this.$http(
        '/stage/user/getAppletsWxManager',
        {
          museumId: this.museumId
        },
        'POST',
        (res) => {
          if (res.data.code == 200) {
            this.managerdata = res.data.data.records
          } else {
            this.$Message.error(res.data.msg)
          }
        }
      )
    },
    unbindAppletsWxManager () {
      // return
      this.$http(
        '/stage/user/unbindAppletsWxManager',
        {
          id: this.managerdatas.id
        },
        'get',
        (res) => {
          if (res.data.code == 200) {
            this.$Message.success('解绑成功')
            this.getAppletsWxManager()
          } else {
            this.$Message.error(res.data.msg)
          }
        }
      )
    },
    erdata () {
      this.managerdata = false
      this.unbindAppletsWxManager()
    },
    cancel () {
      console.log('取消了')
    },
    cancels () {
      this.modelshow = false
      this.checkboxGroup4 = []
      this.ticketNum = []
      this.time2 = []
    },
    yuyue () {
      this.select = 1
    },
    //   tuanyuyue() {
    //   this.select = 4;
    // },
    xiaochengxu () {
      this.select = 2
      this.getAppletsWxManager()
    },
    riqi () {
      this.select = 3
      this.getCalendarStocks(this.time)
    },
    // 生成海报 - 4
    twoTOneModule4 () {
      let that = this
      this.loading21 = true
      this.CODE4 = ''
      axios({
        method: 'get',
        url:
          this.color == '1'
            ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
            : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'arraybuffer',
        params: {
          museumId: this.museumId
        }
      }).then(function (res) {
        var base64 = that.transformArrayBufferToBase64(res.data)
        that.CODE4 = base64
        that.loading21 = false
        that.codeModal4 = true
      })
    },
    // 导出海报
    code_download4 () {
      var that = this
      let shareContent = this.$refs.codePage4, // 需要截图的包裹的（原生的）DOM 对象
        width = shareContent.clientWidth, // shareContent.offsetWidth; //获取dom 宽度
        height = shareContent.clientHeight, // shareContent.offsetHeight; //获取dom 高度
        canvas = document.createElement('canvas'), // 创建一个canvas节点
        scale = 1 // 定义任意放大倍数 支持小数
      canvas.width = width * scale // 定义canvas 宽度 * 缩放
      canvas.height = height * scale // 定义canvas高度 *缩放
      let opts = {
        scale: scale, // 添加的scale 参数
        canvas: canvas, // 自定义 canvas
        logging: false, // 日志开关，便于查看html2canvas的内部执行流程
        width: width, // dom 原始宽度
        height: height,
        useCORS: true
      }
      this.loading21 = true
      html2canvas(shareContent, opts)
        .then(function (canvas) {
          var url = canvas.toDataURL('image/png', 100)
          let elink = document.createElement('a')
          elink.download = '20秒入园海报.png'
          elink.style.display = 'none'
          let blob = that.dataURLtoBlob(url)
          elink.href = URL.createObjectURL(blob)
          document.body.appendChild(elink)
          elink.click()
          document.body.removeChild(elink)
          that.loading21 = false
        })
        .catch(function (reason) {
          that.$Message.error(reason)
          that.loading21 = false
        })
    },

    // 检测是否有预约规则
    hasReservationRule () {
      this.$http(
        '/stage/reservation/hasReservationRule',
        {
          museumId: this.museumId
        },
        'get',
        (res) => {
          if (res.data.code == 200) {
            if (!res.data.data) {
              this.has = true
            }
            this.getReservationMuseumRule()
          } else {
            this.$Message.error(res.data.msg)
          }
        }
      )
    },
    chushihua () {
      this.loading18 = true
      this.$http(
        '/stage/reservation/initReservationRule',
        {
          museumId: this.museumId
        },
        'get',
        (res) => {
          if (res.data.code == 200) {
            this.getReservationMuseumRule()
            this.has = false
            this.$Message.success('预约规则初始化成功')
          } else {
            this.$Message.error(res.data.msg)
          }
          this.loading18 = false
        }
      )
    },

    // 复制
    onCopy () {
      this.$Message.success('链接复制成功')
    },
     onCopyappId () {
      this.$Message.success('小程序appId复制成功')
    },
    // 复制失败
    onError () {
      this.$Message.error('链接复制失败')
    },

    // 二码合一导出
    twoTOne () {
      this.loading12 = true
      let that = this
      axios({
        method: 'get',
        url:
          this.color == '1'
            ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
            : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
        // url: this.baseUrl + '/stage/qrCode/generateQRCodeMerge',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          museumId: this.museumId
        }
      })
        .then(function (res) {
          let filename =
            res.headers['content-disposition'].split('filename=')[1]
          let blob = new Blob([res.data], {
            type: 'application/x-zip-compressed'
          })
          let objectUrl = URL.createObjectURL(blob)
          let a = document.createElement('a')
          a.href = objectUrl
          // a.download = "二码合一二维码"
          a.download = decodeURI(filename)
          a.dispatchEvent(
            new MouseEvent('click', {
              bubbles: true,
              cancelable: true,
              view: window
            })
          )
          window.URL.revokeObjectURL(blob)
          that.loading12 = false
        })
        .catch((resp) => {
          that.loading12 = false
          that.$Message.error('导出二维码失败')
        })
    },

    // 生成海报 - 1
    twoTOneModule () {
      let that = this
      this.loading13 = true
      this.CODE = ''
      axios({
        method: 'get',
        url:
          this.color == '1'
            ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
            : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'arraybuffer',
        params: {
          museumId: this.museumId
        }
      }).then(function (res) {
        var base64 = that.transformArrayBufferToBase64(res.data)
        that.CODE = base64
        that.loading13 = false
        that.codeModal = true
      })
    },
    // 导出海报
    code_download () {
      var that = this
      let shareContent = this.$refs.codePage, // 需要截图的包裹的（原生的）DOM 对象
        width = shareContent.clientWidth, // shareContent.offsetWidth; //获取dom 宽度
        height = shareContent.clientHeight, // shareContent.offsetHeight; //获取dom 高度
        canvas = document.createElement('canvas'), // 创建一个canvas节点
        scale = 1 // 定义任意放大倍数 支持小数
      canvas.width = width * scale // 定义canvas 宽度 * 缩放
      canvas.height = height * scale // 定义canvas高度 *缩放
      let opts = {
        scale: scale, // 添加的scale 参数
        canvas: canvas, // 自定义 canvas
        logging: false, // 日志开关，便于查看html2canvas的内部执行流程
        width: width, // dom 原始宽度
        height: height,
        useCORS: true
      }
      this.loading14 = true
      html2canvas(shareContent, opts)
        .then(function (canvas) {
          var url = canvas.toDataURL('image/png', 100)
          let elink = document.createElement('a')
          elink.download = '预约核销二维码海报.png'
          elink.style.display = 'none'
          let blob = that.dataURLtoBlob(url)
          elink.href = URL.createObjectURL(blob)
          document.body.appendChild(elink)
          elink.click()
          document.body.removeChild(elink)
          that.loading14 = false
        })
        .catch(function (reason) {
          that.$Message.error(reason)
          that.loading14 = false
        })
    },

    // 生成海报 - 2
    twoTOneModule3 () {
      let that = this
      this.loading19 = true
      this.CODE3 = ''
      axios({
        method: 'get',
        url:
          this.color == '1'
            ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
            : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'arraybuffer',
        params: {
          museumId: this.museumId
        }
      }).then(function (res) {
        var base64 = that.transformArrayBufferToBase64(res.data)
        that.CODE3 = base64
        that.loading19 = false
        that.codeModal3 = true
      })
    },
    // 导出海报
    code_download3 () {
      var that = this
      let shareContent = this.$refs.codePage3, // 需要截图的包裹的（原生的）DOM 对象
        width = shareContent.clientWidth, // shareContent.offsetWidth; //获取dom 宽度
        height = shareContent.clientHeight, // shareContent.offsetHeight; //获取dom 高度
        canvas = document.createElement('canvas'), // 创建一个canvas节点
        scale = 1 // 定义任意放大倍数 支持小数
      canvas.width = width * scale // 定义canvas 宽度 * 缩放
      canvas.height = height * scale // 定义canvas高度 *缩放
      let opts = {
        scale: scale, // 添加的scale 参数
        canvas: canvas, // 自定义 canvas
        logging: false, // 日志开关，便于查看html2canvas的内部执行流程
        width: width, // dom 原始宽度
        height: height,
        useCORS: true
      }
      this.loading20 = true
      html2canvas(shareContent, opts)
        .then(function (canvas) {
          var url = canvas.toDataURL('image/png', 100)
          let elink = document.createElement('a')
          elink.download = '预约核销二维码海报.png'
          elink.style.display = 'none'
          let blob = that.dataURLtoBlob(url)
          elink.href = URL.createObjectURL(blob)
          document.body.appendChild(elink)
          elink.click()
          document.body.removeChild(elink)
          that.loading20 = false
        })
        .catch(function (reason) {
          that.$Message.error(reason)
          that.loading20 = false
        })
    },

    // 生成推文配图
    twoTOneModule2 () {
      let that = this
      this.loading15 = true
      this.CODE2 = ''
      axios({
        method: 'get',
        url:
          this.color == '1'
            ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
            : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'arraybuffer',
        params: {
          museumId: this.museumId
        }
      }).then(function (res) {
        var base64 = that.transformArrayBufferToBase64(res.data)
        that.CODE2 = base64
        that.loading15 = false
        that.codeModal2 = true
      })
    },
    // 导出推文配图
    code_download2 () {
      var that = this
      let shareContent = this.$refs.codePage2, // 需要截图的包裹的（原生的）DOM 对象
        width = shareContent.clientWidth, // shareContent.offsetWidth; //获取dom 宽度
        height = shareContent.clientHeight, // shareContent.offsetHeight; //获取dom 高度
        canvas = document.createElement('canvas'), // 创建一个canvas节点
        scale = 1 // 定义任意放大倍数 支持小数
      canvas.width = width * scale // 定义canvas 宽度 * 缩放
      canvas.height = height * scale // 定义canvas高度 *缩放
      let opts = {
        scale: scale, // 添加的scale 参数
        canvas: canvas, // 自定义 canvas
        logging: false, // 日志开关，便于查看html2canvas的内部执行流程
        width: width, // dom 原始宽度
        height: height,
        useCORS: true
      }
      this.loading16 = true
      html2canvas(shareContent, opts)
        .then(function (canvas) {
          var url = canvas.toDataURL('image/png', 100)
          let elink = document.createElement('a')
          elink.download = '预约核销二维码推文配图.png'
          elink.style.display = 'none'
          let blob = that.dataURLtoBlob(url)
          elink.href = URL.createObjectURL(blob)
          document.body.appendChild(elink)
          elink.click()
          document.body.removeChild(elink)
          that.loading16 = false
        })
        .catch(function (reason) {
          that.$Message.error(reason)
          that.loading16 = false
        })
    },

    getAppMuseumDropDown () {
      this.loading1 = true
      this.$http('/stage/museum/getAppMuseumDropDown', {}, 'post', (res) => {
        if (res.data.code == 200) {
          this.museumList = res.data.data
          for (let i = 0; i < this.museumList.length; i++) {
            if (this.museumList[i].name.length > 20) {
              this.museumList[i].name =
                this.museumList[i].name.slice(0, 20) + '...'
            }
          }
          this.museumId = this.museumList[0].id
          this.museumName = this.museumList[0].name
          this.getReservationMuseumRule()
        } else {
          this.$Message.error(res.data.msg)
        }
      })
    },
    getReservationMuseumRule () {
      if (this.$store.state.superAdmin == 'true') {
        for (let i = 0; i < this.museumList.length; i++) {
          if (this.museumId == this.museumList[i].id) {
            this.museumName = this.museumList[i].name
          }
        }
      }
      this.loading1 = true
      this.$http(
        '/stage/reservation/getReservationMuseumRule',
        {
          appMuseumId: this.museumId
        },
        'post',
        (res) => {
          if (res.data.code == 200) {
            this.loading1 = false
            this.data = res.data.data
            for (let i = 0; i < this.data.length; i++) {
              switch (this.data[i].dayOfWeek) {
                case 1:
                  this.data[i].dayOfWeek2 = '星期一'
                  break
                case 2:
                  this.data[i].dayOfWeek2 = '星期二'
                  break
                case 3:
                  this.data[i].dayOfWeek2 = '星期三'
                  break
                case 4:
                  this.data[i].dayOfWeek2 = '星期四'
                  break
                case 5:
                  this.data[i].dayOfWeek2 = '星期五'
                  break
                case 6:
                  this.data[i].dayOfWeek2 = '星期六'
                  break
                case 7:
                  this.data[i].dayOfWeek2 = '星期日'
                  break
              }

              if (this.data[i].amQuota != undefined) {
                this.data[i].amQuota2 = this.data[i].amQuota + '人'
              }
              if (this.data[i].pmQuota != undefined) {
                this.data[i].pmQuota2 = this.data[i].pmQuota + '人'
              }
              if (this.data[i].quota != undefined) {
                this.data[i].quota2 = this.data[i].quota + '人'
              }
              if (this.data[i].beforehandHour != undefined) {
                this.data[i].beforehandHour2 =
                  this.data[i].beforehandHour + '小时'
              }
              this.data[i].mostDays2 = this.data[i].mostDays + '天内'
            }
            this.getAppletsWxManager()
            this.getCalendarStocks(this.time)
          } else {
            this.loading1 = false
            this.$Message.error(res.data.msg)
          }
        }
      )
    },
    create () {
      this.id = ''
      this.bol = true
      this.newData = {
        amQuota: '',
        mostDays: '',
        dayOfWeek1: [1, 2, 3, 4, 5, 6, 7],
        detailedSettings: [],
        pmQuota: '',
        quota: '',
        time: ''
      }

      console.log(this.newData.dayOfWeek, '123')
      this.detailedSettings = []
      this.$http('/stage/reservation/getReservationMuseumArrivalRangeDropdown', {
        museumId: this.museumId
      }, 'get', (res) => {
        console.log(res)
        if (res.data.code == 200) {
          res.data.data.map(item => {
            this.detailedSettings.push({
              sessionTime: item.timeRange.split('-'),
              num: ''
            })
          })
        }
      })
      this.modal = true
      console.log(this.modal)
    },
    detail (params) {
      this.newData.dayOfWeek = null
      this.newData = {
        mostDays: params.row.mostDays,
        dayOfWeek: params.row.dayOfWeek,
        time: [params.row.beginTime, params.row.endTime]
      }
      console.log(params)
      this.detailedSettings = []
      this.$http('/stage/reservation/getReservationMuseumSessionDetail', {
        id: params.row.id
      }, 'get', (res) => {
        console.log(res)
        if (res.data.code == 200) {
          res.data.data.sessionSettings.map(item => {
            this.detailedSettings.push({
              sessionTime: item.sessionTime.split('-'),
              num: item.num
            })
          })
        }
      })
      this.modal3 = true
    },
    update (params) {
      this.newData.dayOfWeek = null
      this.bol = false
      this.detailedSettings = []
      this.id = params.row.id
      this.newData = {
        mostDays: params.row.mostDays,
        dayOfWeek: params.row.dayOfWeek,
        time: [params.row.beginTime, params.row.endTime]
      }
      console.log(params)
      this.detailedSettings = []
      this.$http('/stage/reservation/getReservationMuseumSessionDetail', {
        id: params.row.id
      }, 'get', (res) => {
        console.log(res)
        if (res.data.code == 200) {
          res.data.data.sessionSettings.map(item => {
            this.detailedSettings.push({
              sessionTime: item.sessionTime.split('-'),
              num: item.num
            })
          })
        }
      })
      this.modal = true
    },
    submit () {
      // return false
      console.log(this.newData)
      if (!this.newData.dayOfWeek&&this.newData.dayOfWeek1.length==0) {
        this.$Message.error('请输入星期')
        return false
      }
      if (!this.newData.time[0]) {
        this.$Message.error('请选择开始时间和结束时间')
        return false
      }
      let detailedSettings = []
      this.detailedSettings.map(item => {
        detailedSettings.push({
          sessionTime: item.sessionTime[0] + '-' + item.sessionTime[1],
          num: item.num
        })
      })
      let weeks = []
      if (!this.bol) {
        weeks.push(this.newData.dayOfWeek)
      } else {
        weeks = this.newData.dayOfWeek1
      }
      let data = {}

      data = {
        museumId: this.museumId,
        mostDays:
            this.newData.mostDays == '' ? '' : parseInt(this.newData.mostDays),
        weeks: weeks,
        sessionSettings: detailedSettings,
        beginTime:
            this.newData.time[0] == undefined ? '' : this.newData.time[0],
        endTime:
            this.newData.time[0] == undefined ? '' : this.newData.time[1]
      }
      this.loading2 = true
      this.$http(
        '/stage/reservation/quickSetReservationMuseumRule',
        data,
        'post',
        (res) => {
          if (res.data.code == 200) {
            this.$Message.success('操作成功')
            this.getReservationMuseumRule()
            this.modal = false
          } else {
            this.$Message.error(res.data.msg)
          }
          this.loading2 = false
        }
      )
    },
    add () {
      this.detailedSettings.push({
        timeArea: [],
        num: 0
      })
    },
    setup () {
      let arr = []
      // for(let i=0;i<this.newData.detailedSettings.length;i++){
      // 	arr.push({
      // 		num: this.newData.detailedSettings[i].num,
      // 		timeArea: [this.newData.detailedSettings[i].timeAreaStart , this.newData.detailedSettings[i].timeAreaEnd ]
      // 	})
      // }

      // if(this.id == ''){

      // }else{
      // 	for(let i=0;i<this.newData.detailedSettings.length;i++){
      // 		if(this.newData.detailedSettings[i].id){
      // 			arr.push({
      // 				id: this.newData.detailedSettings[i].id,
      // 				num: this.newData.detailedSettings[i].num,
      // 				timeArea: this.newData.detailedSettings[i].timeAreaStart.substring(0,5)+'-'+this.newData.detailedSettings[i].timeAreaEnd.substring(0,5)
      // 			})
      // 		}else{
      // 			arr.push({
      // 				num: this.newData.detailedSettings[i].num,
      // 				timeArea: this.newData.detailedSettings[i].timeAreaStart.substring(0,5)+'-'+this.newData.detailedSettings[i].timeAreaEnd.substring(0,5)
      // 			})
      // 		}
      // 	}
      // }
      // return false

      this.loading17 = true
      this.$http(
        '/stage/reservation/getReservationConfig',
        {
          museumId: this.museumId
        },
        'get',
        (res) => {
          this.loading17 = false
          if (res.data.code == 200) {
            this.arrivalPavilions = res.data.data.arrivalPavilions
            if (this.id == '') {
              for (let i = 0; i < this.arrivalPavilions.length; i++) {
                arr.push({
                  num: '',
                  timeArea: this.arrivalPavilions[i]
                })
              }
            } else {
              for (let i = 0; i < this.newData.detailedSettings.length; i++) {
                if (this.newData.detailedSettings[i].id) {
                  arr.push({
                    id: this.newData.detailedSettings[i].id,
                    num: this.newData.detailedSettings[i].num,
                    timeArea:
                      this.newData.detailedSettings[i].timeAreaStart.substring(
                        0,
                        5
                      ) +
                      '-' +
                      this.newData.detailedSettings[i].timeAreaEnd.substring(
                        0,
                        5
                      )
                  })
                } else {
                  arr.push({
                    num: this.newData.detailedSettings[i].num,
                    timeArea:
                      this.newData.detailedSettings[i].timeAreaStart.substring(
                        0,
                        5
                      ) +
                      '-' +
                      this.newData.detailedSettings[i].timeAreaEnd.substring(
                        0,
                        5
                      )
                  })
                }
              }
            }
            this.detailedSettings = arr
            this.modal2 = true
          } else {
            this.$Message.error(res.data.msg)
          }
        }
      )
    },
    del (key) {
      this.detailedSettings.splice(key, 1)
    },
    submit2 () {
      if (this.detailedSettings.length != 0) {
        if (this.detailedSettings.length != this.arrivalPavilions.length) {
          this.$Message.error('请确保详细设置时间段和到馆时间时间段一致')
          return false
        } else {
          for (let i = 0; i < this.detailedSettings.length - 1; i++) {
            for (let j = i + 1; j < this.detailedSettings.length; j++) {
              if (
                this.detailedSettings[i].timeArea ==
                this.detailedSettings[j].timeArea
              ) {
                this.$Message.error('详细设置时间段不能有重复的')
                return false
              }
            }
          }
          this.submit2Continue()
        }
      } else {
        this.submit2Continue()
      }
    },
    submit2Continue () {
      if (this.detailedSettings.length == 0) {
        this.modal2 = false
        this.newData.detailedSettings = []
      } else {
        for (let i = 0; i < this.detailedSettings.length; i++) {
          if (this.detailedSettings[i].timeArea.length == 0) {
            this.$Message.error('请确保表单填写完毕')
            return false
          }
        }
        let arr = []
        // return false
        for (let i = 0; i < this.detailedSettings.length; i++) {
          // arr.push({
          // 	num: this.detailedSettings[i].num,
          // 	timeAreaStart: this.detailedSettings[i].timeArea[0],
          // 	timeAreaEnd: this.detailedSettings[i].timeArea[1],
          // })
          if (this.detailedSettings[i].id) {
            arr.push({
              id: this.detailedSettings[i].id,
              num: this.detailedSettings[i].num,
              timeAreaStart:
                this.detailedSettings[i].timeArea.split('-')[0] + ':00',
              timeAreaEnd:
                this.detailedSettings[i].timeArea.split('-')[1] + ':00'
            })
          } else {
            arr.push({
              num: this.detailedSettings[i].num,
              timeAreaStart:
                this.detailedSettings[i].timeArea.split('-')[0] + ':00',
              timeAreaEnd:
                this.detailedSettings[i].timeArea.split('-')[1] + ':00'
            })
          }
        }
        this.modal2 = false
        this.newData.detailedSettings = arr
      }
    },
    delItem (params) {
      this.$Modal.confirm({
        title: '提示',
        content: '<p>确定要删除此规则吗？</p>',
        onOk: () => {
          this.loading1 = true
          this.$http(
            '/stage/reservation/deleteReservationMuseumRule',
            {
              id: params.row.id
            },
            'get',
            (res) => {
              if (res.data.code == 200) {
                if (res.data.data) {
                  this.$Message.success('删除规则成功')
                } else {
                  this.$Message.error('删除规则失败')
                }
                this.getReservationMuseumRule()
              } else {
                this.$Message.error(res.data.msg)
              }
            }
          )
        }
      })
    },
    download () {
      this.loading3 = true
      let that = this
      axios({
        method: 'get',
        url:
          this.color == '1'
            ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
            : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
        // url: this.baseUrl + '/stage/qrCode/generateReservationQRCode',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          museumId: this.museumId
        }
      })
        .then(function (res) {
          let blob = new Blob([res.data], {
            type: 'application/x-zip-compressed'
          })
          let objectUrl = URL.createObjectURL(blob)
          let a = document.createElement('a')
          a.href = objectUrl
          a.download = '文旅绿码'
          a.dispatchEvent(
            new MouseEvent('click', {
              bubbles: true,
              cancelable: true,
              view: window
            })
          )
          window.URL.revokeObjectURL(blob)
          that.loading3 = false
        })
        .catch((resp) => {
          that.loading3 = false
          that.$Message.error('导出二维码失败')
        })
    },
    download2 () {
      this.loading5 = true
      let that = this
      axios({
        method: 'get',
        url:
          this.color == '1'
            ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
            : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
        // url: this.baseUrl + '/stage/qrCode/generateSelfCheckQRCode',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          museumId: this.museumId
        }
      })
        .then(function (res) {
          let blob = new Blob([res.data], {
            type: 'application/x-zip-compressed'
          })
          let objectUrl = URL.createObjectURL(blob)
          let a = document.createElement('a')
          a.href = objectUrl
          a.download = '核销二维码'
          a.dispatchEvent(
            new MouseEvent('click', {
              bubbles: true,
              cancelable: true,
              view: window
            })
          )
          window.URL.revokeObjectURL(blob)
          that.loading5 = false
        })
        .catch((resp) => {
          that.loading5 = false
          that.$Message.error('导出二维码失败')
        })
    },
    getPassword () {
      this.loading4 = true
      this.$http(
        '/stage/reservation/getBindCheckerSecret',
        {
          museumId: this.museumId
        },
        'get',
        (res) => {
          this.loading4 = false
          if (res.data.code == 200) {
            if (res.data.data) {
              document.getElementById('qrcode').innerHTML = ''
              let qrcode = new QRCode('qrcode', {
                width: 365,
                height: 365,
                text: res.data.data + '/' + new Date().getTime()
              })
              // qrcode.clear()

              this.qrcodeModal = true
            } else {
              this.$Message.error('获取密钥失败')
            }
          } else {
            this.$Message.error(res.data.msg)
          }
        }
      )
    },
    copy (params) {
      this.detailedSettings = []
      this.id = ''
      this.newData = {
        amQuota: params.row.amQuota == undefined ? '' : params.row.amQuota,
        mostDays: params.row.mostDays,
        dayOfWeek: params.row.dayOfWeek,
        detailedSettings: [],
        // detailedSettings: params.row.detailedSettings == undefined ? [] : params.row.detailedSettings,
        pmQuota: params.row.pmQuota == undefined ? '' : params.row.pmQuota,
        quota: params.row.quota,
        time: [params.row.beginTime, params.row.endTime]
      }
      if (params.row.detailedSettings != undefined) {
        for (let i = 0; i < params.row.detailedSettings.length; i++) {
          this.newData.detailedSettings.push({
            num: params.row.detailedSettings[i].num,
            timeAreaEnd: params.row.detailedSettings[i].timeAreaEnd,
            timeAreaStart: params.row.detailedSettings[i].timeAreaStart
          })
        }
      }
      this.modal = true
    },
    setAllday () {
      this.newData.time = ['00:00:00', '23:59:59']
    },
    // 微光扫码器规则设置
    setUpWifi () {
      this.weiguangModal = true
      this.weiguangUrl = ''
      this.weiguangData = {
        wifiName: '',
        wifiPassword: ''
      }
    },
    // 微光扫码器规则设置 - submit
    weiguangSubmit () {
      if (!this.weiguangData.wifiName) {
        this.$Message.error('请输入wifi名称')
        return false
      }
      // if(!this.weiguangData.wifiPassword){
      // 	this.$Message.error('请输入wifi密码')
      // 	return false
      // }
      this.loading22 = true
      let that = this
      axios({
        method: 'post',
        url: this.baseUrl + '/stage/weiguang/setUpWifi',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'arraybuffer',
        data: {
          museumId: this.museumId,
          wifiName: this.weiguangData.wifiName,
          wifiPassword: this.weiguangData.wifiPassword
        }
      })
        .then(function (res) {
          that.loading22 = false
          let url =
            'data:image/PNG;base64,' + that.ArrayBufferToBase64(res.data)
          that.weiguangUrl = url
        })
        .catch((resp) => {
          that.loading22 = false
          that.$Message.error('下载失败')
        })
    },
    weiguangDownload () {
      const image = new Image()
      // 解决跨域 Canvas 污染问题
      image.setAttribute('crossOrigin', 'anonymous')
      image.onload = function () {
        const canvas = document.createElement('canvas')
        canvas.width = image.width
        canvas.height = image.height
        const context = canvas.getContext('2d')
        context.drawImage(image, 0, 0, image.width, image.height)
        const url = canvas.toDataURL('image/png') // 得到图片的base64编码数据
        const a = document.createElement('a') // 生成一个a元素
        const event = new MouseEvent('click') // 创建一个单击事件
        a.download = '微光扫码器二维码' // 设置图片名称
        a.href = url // 将生成的URL设置为a.href属性
        a.dispatchEvent(event) // 触发a的单击事件
      }
      image.src = this.weiguangUrl
    },
    getMpMenuConfig () {
      let that = this
      axios({
        method: 'get',
        url: this.baseUrl + '/stage/reservation/getMpMenuConfig',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        params: {
          museumId: this.museumId
        }
      }).then(function (res) {
        console.log(res)
        that.pagePath = res.data.data.pagePath
        that.alternatePage = res.data.data.alternatePage
        that.appid = res.data.data.appId
        that.router = true
      })
    },
    exportBindAdminQRCode () {
      this.loading23 = true
      let that = this
      axios({
        method: 'get',
        url: this.baseUrl + '/stage/reservation/exportBindAdminQRCode',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'arraybuffer',
        params: {
          museumId: this.museumId
        }
      })
        .then(function (res) {
          that.loading23 = false
          let url =
            'data:image/PNG;base64,' + that.ArrayBufferToBase64(res.data)
          that.adminImg = url
          that.adminModal = true
        })
        .catch((resp) => {
          that.loading23 = false
          that.$Message.error('下载失败')
        })
    },
    downloadOldCode () {
      this.loading24 = true
      let that = this
      axios({
        method: 'get',
        url: this.baseUrl + '/stage/qrCode/exportBookMuseumQrCode',
        headers: {
          token: this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          museumId: this.museumId
        }
      })
        .then(function (res) {
          let filename =
            res.headers['content-disposition'].split('filename=')[1]
          let blob = new Blob([res.data], {
            type: 'application/x-zip-compressed'
          })
          let objectUrl = URL.createObjectURL(blob)
          let a = document.createElement('a')
          a.href = objectUrl
          // a.download = "二码合一二维码"
          a.download = decodeURI(filename)
          a.dispatchEvent(
            new MouseEvent('click', {
              bubbles: true,
              cancelable: true,
              view: window
            })
          )
          window.URL.revokeObjectURL(blob)
          that.loading24 = false
        })
        .catch((resp) => {
          that.loading24 = false
          that.$Message.error('导出二维码失败')
        })
    }
  }
}
</script>

<style scoped>
.select3 {
  margin-top: 20px;
}
.del {
  cursor: pointer;
}
.del:hover {
  color: #ed4014;
}

.codeModalClass3 {
  width: 1929px;
  position: relative;
  height: 2717px;
}
.codeModalClass1 {
  width: 2283px;
  position: relative;
  height: 3150px;
}
.codeModalClass4 {
  width: 2268px;
  position: absolute;
  height: 5102px;
}
.codeModalClass {
  width: 468px;
  position: relative;
  height: 693px;
}
.select {
  width: 100%;
  height: 40px;
  /* background-color: rgb(172, 172, 172); */
  /* margin-bottom: 20px; */
}
.btn2 {
  width: 140px;
  height: 40px;
  /* background-color: red; */
  float: left;
  background-color: rgb(245, 247, 250);
  line-height: 40px;
  text-align: center;
  font-size: 16px;
}
.btn1 {
  width: 140px;
  height: 40px;
  /* background-color: red; */
  float: left;
  background-color: white;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
}
.museum_title {
  position: absolute;
  font-size: 76.39px;
  color: #2e2e2e;
  top: 972px;
  text-align: center;
  width: 100%;
  z-index: 2;
  font-weight: bold;
}
.museum_title3 {
  position: absolute;
  font-size: 63.89px;
  color: #2e2e2e;
  top: 840px;
  text-align: center;
  width: 100%;
  z-index: 2;
  font-weight: bold;
}
.museum_title4 {
  position: absolute;
  font-size: 110px;
  color: white;
  top: 2261px;
  text-align: center;
  width: 100%;
  z-index: 2;
  font-weight: bold;
}

.codeImg {
  position: absolute;
  width: 625px;
  height: 625px;
  z-index: 2;
  top: 1173px;
  left: 50%;
  margin-left: -312.5px;
}
.codeImg3 {
  position: absolute;
  width: 540px;
  height: 540px;
  z-index: 2;
  top: 1011px;
  left: 50%;
  margin-left: -270px;
}
.codeImg4 {
  position: absolute;
  width: 700px;
  height: 700px;
  z-index: 2;
  top: 2490px;
  left: 50%;
  margin-left: -350px;
}
.codeImg2 {
  position: absolute;
  width: 280px;
  height: 280px;
  z-index: 2;
  top: 215px;
  left: 50%;
  margin-left: -140px;
}

.flexCenter {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.flexCenter p {
  color: #ed4014;
  width: 100px;
  text-align: right;
  cursor: pointer;
  font-size: 14px;
}
.flexCenter p:hover {
  opacity: 0.8;
}
.newWarehouse {
  margin-left: 5px;
}
.table {
  margin-top: 0px;
}
/* .table >>> .ivu-table{
  margin-top: 0px !important;
} */
.table1 {
  /* display: flex; */
  /* margin-top: 15px; */
  overflow-x: scroll;
}
.neirong {
  width: 200px;
  height: 60px;
  transition: all 0.5s;
  display: flex;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  border-bottom: 1px solid #ccc;
  background: #fff;
}
.neirong:hover {
  background-color: #ccc;
}
.table1 .column {
  width: 200px;
  display: table-cell;
  text-align: center;
  border-bottom: 1px solid #ccc;
}
.table1 .title {
  height: 40px;
  line-height: 40px;
  font-size: 18px;
  background-color: rgb(248, 249, 251);
}
.time,
.num {
  display: flex;

  align-items: center;
  justify-content: center;
  font-size: 16px;
}
.select3 {
  background: #fff;
  margin-top: 0px;
  padding: 10px 0;
}
.table1 {
  background: #fff;
  padding-top: 10px;
  padding-bottom: 10px;
  /* position: absolute; */
}
</style>
